<template>
  <div>
    <p style="color: white">1</p>
    <van-nav-bar
      :fixed="true"
      title="数码"
      left-text="返回"
      @click-left="onClickLeft"
      left-arrow
    />
    <van-dropdown-menu active-color="#1989fa">
      <van-dropdown-item v-model="value1" :options="option1"/>
      <van-dropdown-item v-model="value2" :options="option2"/>
    </van-dropdown-menu>
    <div>
      <van-card
        price="2399.00"
        desc="IOS7 6+64GB 平板电脑"
        title="iPad"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        thumb-link="/#/productDetails"
      >
        <template #tags>
          <van-tag plain type="primary">数码</van-tag>
        </template>

      </van-card>
      <van-card
        price="2399.00"
        desc="IOS7 6+64GB 平板电脑"
        title="iPad"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        thumb-link="/#/productDetails"
      >
        <template #tags>
          <van-tag plain type="primary">数码</van-tag>
        </template>

      </van-card>
      <van-card
        price="2399.00"
        desc="IOS7 6+64GB 平板电脑"
        title="iPad"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        thumb-link="/#/productDetails"
      >
        <template #tags>
          <van-tag plain type="primary">数码</van-tag>
        </template>

      </van-card>
      <van-card
        price="2399.00"
        desc="IOS7 6+64GB 平板电脑"
        title="iPad"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        thumb-link="/#/productDetails"
      >
        <template #tags>
          <van-tag plain type="primary">数码</van-tag>
        </template>

      </van-card>
      <van-card
        price="2399.00"
        desc="IOS7 6+64GB 平板电脑"
        title="iPad"
        thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        thumb-link="/#/productDetails"
      >
        <template #tags>
          <van-tag plain type="primary">数码</van-tag>
        </template>

      </van-card>
    </div>
  </div>
</template>

<script>
export default {
  name: "type",
  data() {
    return {
      value1: 0,
      value2: 'a',
      option1: [
        {text: '全部商品', value: 0},
        {text: '新款商品', value: 1},
        {text: '活动商品', value: 2},
      ],
      option2: [
        {text: '默认排序', value: 'a'},
        {text: '好评排序', value: 'b'},
        {text: '销量排序', value: 'c'},
      ],
    };
  },
  methods:{
    onClickLeft() {
      this.$router.push('/allType');
    },
  }
}
</script>

<style scoped>

</style>
